<template>
    <el-dialog :close-on-click-modal="false" :visible.sync="visible" title="文件预览" width="70%" @close="closePreview">
        <el-alert v-if="previewData.fileType === '33'" title="内容由ai数字人生成，请注意甄别内容" type="info">
        </el-alert>
        <div style="overflow-x: hidden; overflow-y: auto">
            <div v-if="previewData.fileType === '33'">
                <video-player v-model="previewData.viewUrl" :ref-id="previewData.id" @loadError="videoLoadError" />
            </div>
            <pdf-reader v-if="previewData.fileType === '11'" :src="previewData.viewUrl" />
            <pdf-reader v-if="previewData.fileType === '22'" :src="previewData.fileUrl" />
        </div>
    </el-dialog>
</template>

<script>
import VideoPlayer from "@/components/VideoPlayer";
import PdfReader from "@/components/PdfReader";

export default {
    name: "FilePreviewDialog",
    components: {
        VideoPlayer,
        PdfReader
    },
    props: {
        visible: {
            type: Boolean,
            default: false
        },
        previewData: {
            type: Object,
            default: () => ({})
        }
    },
    methods: {
        closePreview() {
            this.$emit("update:visible", false);
        },
        videoLoadError() {
            this.$emit("update:visible", false);
            this.$message({
                type: "error",
                message: "授课视频正在生成中，暂不能预览",
                duration: 3000
            });
        }
    }
};
</script>
